<!-- 总体目标 -->
 <template>
   <div class="content">
    <el-card class="box-card">
      <div slot="header">
        <span style="color: rgb(14, 175, 14);">光伏治沙总体目标</span>
      </div>
      <div class="info">
        <span>1</span>光伏装机及发电量。到 2025 年，光伏装机,2140万千瓦，年发电量约 30亿千瓦时;到2030年，光伏装机, 8900万千瓦，年发电量 1500亿千瓦时。<br><br>
        <span>2</span>生态效益。到 2025年，完成光伏治沙面积 64万亩;到 2030 年完成光伏治沙面积约 230万亩。
      </div>
      <div class="table">
        <el-table :data="tableData" style="width: 100%;">
          <el-table-column label="'十四五'规划投产光伏治沙项目" header-align="center">
            <el-table-column label="项目分类" prop="type" header-align="center" align="center"></el-table-column>
            <el-table-column label="治理面积（万亩）" prop="area" header-align="center" align="center" width="90"></el-table-column>
            <el-table-column label="个数" prop="count" header-align="center" align="center" width="50"></el-table-column>
            <el-table-column label="装机容量（万千瓦）" prop="capacity" header-align="center" align="center" width="90"></el-table-column>
          </el-table-column>
        </el-table>
      </div>
    </el-card>
   </div>
 </template>
 
 <script>
 export default {
  data() {
    return {
      tableData: [
        {
          type: '保障性并网项目',
          area: '10',
          count: '4',
          capacity: '355'
        },
        {
          type: '国家-二三批大基地项育',
          area: '22',
          count: '9',
          capacity: '765'
        },
        {
          type: '沙戈荒大基地先导工程',
          area: '11',
          count: '4',
          capacity: '400'
        },
        {
          type: '市场化并网项目',
          area: '3',
          count: '3',
          capacity: '100'
        },
        {
          type: '已建成项目',
          area: '18',
          count: '18',
          capacity: '520'
        },
        {
          type: "'十四五'总计建设顷目",
          area: '64',
          count: '38',
          capacity: '2140'
        }
      ]
    }
  }
 }
 </script>
 
 <style lang="scss" scoped>
 .content {
  margin-left: 20px;
  height: 670px;
  .box-card {
    width: 100%;
    margin: 20px;
    margin-bottom: 0;
    .info {
      margin-bottom: 20px;
      font-size: 14px;
      span {
        margin-right: 5px;
        display: inline-block;
        width: 25px;
        height: 25px;
        line-height: 25px;
        font-size: 16px;
        color: #fff;
        background-color: green;
        text-align: center;
        border-radius: 12.5px;
      }
    }
  }
 }
 </style>